Data Template এবং Item Controls

WPF (Windows Presentation Foundation) এর মধ্যে Data Template এবং Item Controls অত্যন্ত গুরুত্বপূর্ণ উপাদান যা ডেটাকে কাস্টমাইজড ভাবে উপস্থাপন করতে সাহায্য করে। Data Template আপনাকে ডেটা প্রদর্শনের কাস্টম লেআউট তৈরি করতে দেয়, এবং Item Controls ডেটা কলেকশনগুলিকে একটি নির্দিষ্ট লেআউটে রেন্ডার করতে ব্যবহৃত হয়। এই দুটি কনসেপ্ট একসাথে ব্যবহার করে ডাইনামিক, ডেটা-ড্রিভেন ইউজার ইন্টারফেস তৈরি করা যায়।

১. Data Template কী? (What is Data Template?)

Data Template একটি WPF ফিচার যা ডেটা রেন্ডার করার জন্য কাস্টম লেআউট এবং ডিজাইন প্রদান করে। এটি WPF এ ডেটার কন্টেন্ট কিভাবে প্রদর্শিত হবে তা নির্ধারণ করতে ব্যবহৃত হয়। Data Template নির্ধারণের মাধ্যমে আপনি ডেটা রূপান্তর করতে পারেন, যেমন কিভাবে একটি কন্ট্রোল (যেমন TextBlock, Image) ডেটাকে UI তে উপস্থাপন করবে।

Data Template সাধারণত WPF এর ItemControl বা ContentControl কন্ট্রোলের সাথে ব্যবহার করা হয়, যা ডেটা এক্সটেনশনে সহায়তা করে।

Data Template এর উদাহরণ (Example of Data Template)

ধরা যাক, আপনি একটি ডেটা কলেকশন (যেমন একটি স্টুডেন্ট অবজেক্ট) প্রদর্শন করতে চান। নিচে একটি Data Template উদাহরণ দেওয়া হলো:

<Window x:Class="WPFApplication.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Data Template Example" Height="350" Width="525">
    <Window.Resources>
        <DataTemplate x:Key="StudentTemplate">
            <StackPanel>
                <TextBlock Text="{Binding Name}" FontSize="16" FontWeight="Bold"/>
                <TextBlock Text="{Binding Age}" FontSize="14"/>
                <TextBlock Text="{Binding Grade}" FontSize="14"/>
            </StackPanel>
        </DataTemplate>
    </Window.Resources>
    
    <ListBox Name="studentsListBox" ItemTemplate="{StaticResource StudentTemplate}">
        <ListBox.Items>
            <ListBoxItem>
                <TextBlock Text="Student 1" />
            </ListBoxItem>
            <ListBoxItem>
                <TextBlock Text="Student 2" />
            </ListBoxItem>
        </ListBox.Items>
    </ListBox>
</Window>

এখানে:

• StudentTemplate হল একটি DataTemplate যা Name, Age, এবং Grade প্রপার্টি ধারণকারী StackPanel নিয়ে তৈরি।
• ItemTemplate অ্যাট্রিবিউটের মাধ্যমে DataTemplate সেট করা হয়েছে, যাতে ListBox এর প্রতিটি আইটেম এই টেমপ্লেট অনুসারে প্রদর্শিত হবে।

C# কোডে Data Template ব্যবহার:

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        List<Student> students = new List<Student>
        {
            new Student { Name = "John Doe", Age = 20, Grade = "A" },
            new Student { Name = "Jane Smith", Age = 22, Grade = "B+" }
        };
        studentsListBox.ItemsSource = students;
    }
}

public class Student
{
    public string Name { get; set; }
    public int Age { get; set; }
    public string Grade { get; set; }
}

এখানে:

• ListBox কন্ট্রোলের মধ্যে ডেটা বাইন্ডিং করা হয়েছে যাতে এটি Student ক্লাসের আইটেমগুলো দেখাতে পারে।
• ItemTemplate এর মাধ্যমে প্রতিটি স্টুডেন্টের ডেটা StudentTemplate অনুযায়ী প্রদর্শিত হবে।

২. Item Controls কী? (What is Item Controls?)

Item Controls WPF তে এমন কন্ট্রোল যা ডেটা কলেকশন বা আইটেমের লিস্ট প্রদর্শন করতে ব্যবহৃত হয়। Item Controls এ ব্যবহৃত কিছু জনপ্রিয় কন্ট্রোল হলো ListBox, ComboBox, ListView, TreeView ইত্যাদি।

এরা ডেটা রেন্ডার করার জন্য ItemTemplate ব্যবহার করে, যা প্রতিটি আইটেমের কাস্টম লেআউট তৈরি করে। Item Controls ডেটা প্রদর্শন করার সময় প্রতিটি আইটেমের জন্য পৃথকভাবে Data Template বা ItemTemplate নির্বাচন করতে দেয়।

Item Control এর উদাহরণ (Example of Item Control)

<ListBox Name="studentsListBox" Width="300" Height="200">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel>
                <TextBlock Text="{Binding Name}" FontWeight="Bold" />
                <TextBlock Text="{Binding Age}" />
                <TextBlock Text="{Binding Grade}" />
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

এখানে:

• ListBox একটি ItemControl হিসেবে ব্যবহার করা হচ্ছে, যেখানে ItemTemplate এর মাধ্যমে DataTemplate দেওয়া হয়েছে।
• StackPanel এ TextBlock কন্ট্রোল ব্যবহার করে Name, Age, এবং Grade প্রপার্টি প্রদর্শন করা হচ্ছে।

৩. Item Controls এর অন্যান্য প্রকার (Other Types of Item Controls)

ListBox:

ListBox কন্ট্রোল একটি ItemControl যা ডেটা আইটেমের তালিকা তৈরি করতে ব্যবহৃত হয়। আপনি ItemTemplate ব্যবহার করে প্রতিটি আইটেমের প্রদর্শন কাস্টমাইজ করতে পারেন।

ComboBox:

ComboBox কন্ট্রোল ব্যবহারকারীর জন্য একটি ড্রপডাউন লিস্ট তৈরি করতে সাহায্য করে। এখানে আপনি একটি আইটেমের মধ্যে অনেক অপশন প্রদর্শন করতে পারেন।

<ComboBox Name="comboBox" Width="200">
    <ComboBox.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Name}" />
        </DataTemplate>
    </ComboBox.ItemTemplate>
</ComboBox>

ListView:

ListView কন্ট্রোল একটি উন্নত ListBox যা কলাম ভিত্তিক লেআউট প্রদর্শন করে। এটি সাধারণত টেবিলের মতো ডেটা প্রদর্শন করতে ব্যবহৃত হয়।

<ListView Name="listView" Width="300" Height="200">
    <ListView.View>
        <GridView>
            <GridViewColumn Header="Name" DisplayMemberBinding="{Binding Name}" />
            <GridViewColumn Header="Age" DisplayMemberBinding="{Binding Age}" />
        </GridView>
    </ListView.View>
</ListView>

সারাংশ (Summary)

• Data Template WPF এর একটি শক্তিশালী কনসেপ্ট যা ডেটা প্রদর্শনের জন্য কাস্টম লেআউট তৈরি করতে সাহায্য করে। আপনি এটি ItemTemplate হিসেবে ব্যবহার করতে পারেন ItemControl কন্ট্রোলগুলির মধ্যে।
• Item Controls হলো WPF এর কন্ট্রোলগুলি যা ডেটা আইটেমের তালিকা বা কলেকশন প্রদর্শন করে, যেমন ListBox, ComboBox, ListView ইত্যাদি।
• DataTemplate এবং ItemControl একসাথে ব্যবহার করে আপনি ডাইনামিক এবং কাস্টমাইজড ইউজার ইন্টারফেস তৈরি করতে পারেন যেখানে ডেটা রেন্ডারিং সম্পূর্ণরূপে কাস্টমাইজযোগ্য হয়।

Data Template হল WPF (Windows Presentation Foundation) এর একটি শক্তিশালী বৈশিষ্ট্য, যা ডেটা মডেল এবং UI কন্ট্রোলের মধ্যে সম্পর্ক স্থাপন করতে সহায়তা করে। Data Template ব্যবহার করে আপনি ডেটার কন্টেন্ট এবং প্রদর্শন (display) কাস্টমাইজ করতে পারেন, যাতে UI উপাদানগুলি ডেটার ভিত্তিতে প্রদর্শিত হয়।

WPF অ্যাপ্লিকেশনে, Data Template মূলত একটি UI কন্ট্রোলের কাস্টম লেআউট বা স্টাইলের টেমপ্লেট, যা একটি ডেটা অবজেক্টকে UI তে প্রদর্শন করার জন্য ব্যবহার করা হয়। এটি মূলত Collection বা ItemControl-এর জন্য ব্যবহৃত হয়, যেমন ListBox, ComboBox, ListView ইত্যাদি, যেখানে একাধিক আইটেম/ডেটা দেখানোর জন্য প্রয়োজন হয়।

Data Template এর মৌলিক ধারণা (Core Concept of Data Template)

Data Template একটি নির্দিষ্ট ডেটা টাইপের UI উপস্থাপনাকে কাস্টমাইজ করে, যা আপনার ডেটাকে একটি নির্দিষ্ট লেআউট এবং স্টাইল অনুসারে প্রদর্শন করতে সহায়তা করে। এটি UI কন্ট্রোলের স্টাইলের মতোই কাজ করে, কিন্তু এখানে আপনি কন্টেন্টের কাস্টম প্রদর্শন নির্ধারণ করতে পারেন।

Data Template এর বৈশিষ্ট্য (Features of Data Template)

• ডেটার কাস্টম ডিসপ্লে:
  Data Template আপনাকে ডেটার কাস্টম প্রদর্শন তৈরি করতে দেয়। উদাহরণস্বরূপ, আপনি একটি Person অবজেক্টকে একটি ListBox তে একটি বিশেষভাবে সাজানো UI তে প্রদর্শন করতে পারেন।
• বিভিন্ন ডেটা টাইপের জন্য কাস্টম লেআউট:
  আপনি একটি ডেটা টাইপের জন্য একটি নির্দিষ্ট UI লেআউট তৈরি করতে পারেন এবং সেই লেআউটটি নির্দিষ্ট ডেটার জন্য অ্যাপ্লাই করতে পারেন।
• UI কন্ট্রোলের সাথে বাইন্ডিং:
  Data Template UI কন্ট্রোলের সাথে ডেটা বাইন্ডিং করে কাজ করে। একে ItemsControl (যেমন ListBox, ListView, ComboBox) এর মধ্যে ডেটা কন্টেন্ট রেন্ডার করার জন্য ব্যবহার করা হয়।

Data Template এর উদাহরণ (Example of Data Template)

ধরা যাক, আমাদের কাছে একটি Person ক্লাস আছে, এবং আমরা একটি ListBox এ ব্যক্তির নাম এবং বয়স প্রদর্শন করতে চাই।

Person.cs (C# Model):

public class Person
{
    public string Name { get; set; }
    public int Age { get; set; }
}

এখন, আমরা DataTemplate ব্যবহার করে Person ক্লাসের ডেটা UI তে কাস্টমভাবে প্রদর্শন করব।

MainWindow.xaml:

<Window x:Class="WPFApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="DataTemplate Example" Height="350" Width="525">
    <Window.Resources>
        <!-- Define the DataTemplate -->
        <DataTemplate x:Key="PersonTemplate">
            <StackPanel>
                <TextBlock Text="{Binding Name}" FontWeight="Bold" FontSize="16"/>
                <TextBlock Text="{Binding Age}" FontSize="14"/>
            </StackPanel>
        </DataTemplate>
    </Window.Resources>

    <Grid>
        <ListBox ItemsSource="{Binding People}" ItemTemplate="{StaticResource PersonTemplate}" />
    </Grid>
</Window>

MainWindow.xaml.cs (Code Behind):

using System.Collections.ObjectModel;
using System.Windows;

namespace WPFApp
{
    public partial class MainWindow : Window
    {
        public ObservableCollection<Person> People { get; set; }

        public MainWindow()
        {
            InitializeComponent();
            People = new ObservableCollection<Person>
            {
                new Person { Name = "John", Age = 30 },
                new Person { Name = "Jane", Age = 25 },
                new Person { Name = "Bob", Age = 40 }
            };
            DataContext = this; // Set DataContext to bind the People collection
        }
    }
}

এখানে:

• PersonTemplate নামের একটি DataTemplate তৈরি করা হয়েছে, যা Person অবজেক্টের Name এবং Age প্রপার্টি প্রদর্শন করতে ব্যবহৃত হবে।
• ListBox এর ItemTemplate প্রপার্টি ব্যবহার করে, PersonTemplate কাস্টম টেমপ্লেট হিসেবে সেট করা হয়েছে।
• People নামের একটি ObservableCollection তৈরি করা হয়েছে, যা বিভিন্ন Person অবজেক্ট ধারণ করে এবং তা ListBox তে প্রদর্শিত হয়।

Data Template এর আরো উদাহরণ

ধরা যাক, আপনি একটি ListView ব্যবহার করছেন এবং সেখানে Person অবজেক্টের নাম, বয়স এবং একটি ছবি প্রদর্শন করতে চান:

MainWindow.xaml:

<Window x:Class="WPFApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="DataTemplate Example" Height="350" Width="525">
    <Window.Resources>
        <!-- Define the DataTemplate -->
        <DataTemplate x:Key="PersonTemplate">
            <StackPanel>
                <Image Source="{Binding Photo}" Width="50" Height="50"/>
                <TextBlock Text="{Binding Name}" FontWeight="Bold" FontSize="16"/>
                <TextBlock Text="{Binding Age}" FontSize="14"/>
            </StackPanel>
        </DataTemplate>
    </Window.Resources>

    <Grid>
        <ListView ItemsSource="{Binding People}" ItemTemplate="{StaticResource PersonTemplate}">
            <ListView.View>
                <GridView>
                    <GridViewColumn Header="Name" DisplayMemberBinding="{Binding Name}" />
                    <GridViewColumn Header="Age" DisplayMemberBinding="{Binding Age}" />
                </GridView>
            </ListView.View>
        </ListView>
    </Grid>
</Window>

Person.cs (Updated):

public class Person
{
    public string Name { get; set; }
    public int Age { get; set; }
    public string Photo { get; set; }
}

এখানে, ListView তে একটি GridView ব্যবহার করা হয়েছে এবং DataTemplate এর মাধ্যমে Photo, Name, এবং Age প্রদর্শন করা হয়েছে। আপনি ListView এর মাধ্যমে বিভিন্ন ধরনের কন্টেন্ট কাস্টমাইজড ভাবে প্রদর্শন করতে পারবেন।

Data Template এর কার্যকারিতা (How Data Template Works)

1. Binding:
   Data Template ডেটার সাথে বাইন্ডিংয়ের মাধ্যমে UI উপাদানগুলিকে ডেটার প্রপার্টির সাথে সম্পর্কিত করে। যেমন, আপনি টেক্সট ব্লক বা ইমেজ কন্ট্রোলের মাধ্যমে ডেটার প্রপার্টি প্রদর্শন করতে পারেন।
2. ItemsControl:
   Data Template সাধারণত ItemsControl (যেমন ListBox, ComboBox, ListView) এর সাথে ব্যবহৃত হয়। ItemsControl গুলি ডেটা সোর্স হিসেবে একটি কালেকশন নেয় এবং Data Template এর মাধ্যমে প্রতিটি আইটেমের UI উপস্থাপন তৈরি করে।
3. Customization:
   আপনি Data Template এর মধ্যে বিভিন্ন UI উপাদান যেমন StackPanel, Grid, Image, TextBlock ইত্যাদি ব্যবহার করে কাস্টম UI তৈরি করতে পারেন, যা ডেটার কাস্টম লেআউট প্রদর্শন করবে।

সারাংশ (Summary)

• Data Template WPF তে একটি শক্তিশালী বৈশিষ্ট্য যা ডেটার কন্টেন্ট প্রদর্শন করার জন্য কাস্টম UI লেআউট তৈরি করতে সহায়তা করে।
• Data Template এর মাধ্যমে আপনি বিভিন্ন ডেটা টাইপের জন্য কাস্টম লেআউট তৈরি করতে পারেন এবং UI কন্ট্রোলগুলোর সাথে ডেটা বাইন্ডিং করতে পারেন।
• এটি মূলত ItemsControl (যেমন ListBox, ComboBox, ListView) এর সাথে ব্যবহৃত হয়, যেখানে একাধিক ডেটা আইটেমকে কাস্টমভাবে UI তে প্রদর্শন করা হয়।

WPF (Windows Presentation Foundation) অ্যাপ্লিকেশনগুলিতে ItemsControl, ListView, এবং TreeView হল এমন কন্ট্রোল যা ডেটা বা আইটেমের একটি সংগ্রহ প্রদর্শন করতে ব্যবহৃত হয়। এই কন্ট্রোলগুলি ডেটা-বাইন্ডিং এবং কাস্টম UI উপাদান ব্যবহারের মাধ্যমে একাধিক আইটেমের তালিকা বা কাঠামো প্রদর্শন করতে সক্ষম।

প্রতিটি কন্ট্রোলের নিজস্ব বৈশিষ্ট্য এবং ব্যবহারের ক্ষেত্র রয়েছে, এবং সেগুলি বিভিন্ন ধরনের ডেটা প্রদর্শন করার জন্য খুবই উপকারী।

ItemsControl কী? (What is ItemsControl?)

ItemsControl হল একটি মৌলিক WPF কন্ট্রোল যা ডেটার একটি সংগ্রহ বা লিস্ট প্রদর্শন করতে ব্যবহৃত হয়। এটি সাধারণত অন্যান্য কন্ট্রোলগুলির ভিত্তি হিসেবে ব্যবহৃত হয়, যেমন ListBox, ComboBox, ListView, ইত্যাদি। ItemsControl কেবল আইটেমগুলি প্রদর্শন করে এবং এই আইটেমগুলির কাস্টম লেআউট প্রদর্শন করতে পারে।

ItemsControl কন্ট্রোলের মধ্যে ItemTemplate ব্যবহার করে প্রতিটি আইটেমের জন্য কাস্টম UI উপাদান তৈরি করা যায়।

ItemsControl ব্যবহার উদাহরণ (ItemsControl Example)

MainWindow.xaml:

<Window x:Class="WPFApplication.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="ItemsControl Example" Height="350" Width="525">
    <Grid>
        <ItemsControl Name="itemsControl">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding}" />
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </Grid>
</Window>

MainWindow.xaml.cs:

using System.Windows;

namespace WPFApplication
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            itemsControl.ItemsSource = new string[] { "Apple", "Banana", "Cherry" };
        }
    }
}

এখানে, ItemsControl একটি সংগ্রহের আইটেম প্রদর্শন করছে এবং প্রতিটি আইটেমকে TextBlock এর মাধ্যমে দেখাচ্ছে।

ListView কী? (What is ListView?)

ListView হল একটি উন্নত ItemsControl যা ডেটার সংগ্রহকে একটি টেবিলের মত প্রদর্শন করতে সক্ষম। এটি ListBox এর মতো, তবে এটি কলাম, হেডার এবং সাজানোর ফিচার সমর্থন করে। ListView সাধারণত ডেটা-ভিত্তিক অ্যাপ্লিকেশনের জন্য ব্যবহৃত হয়, যেখানে আইটেমের উপর বিভিন্ন অপারেশন যেমন sort, filter, এবং grouping করার প্রয়োজন হয়।

ListView ব্যবহার উদাহরণ (ListView Example)

MainWindow.xaml:

<Window x:Class="WPFApplication.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="ListView Example" Height="350" Width="525">
    <Grid>
        <ListView Name="listView" Margin="10">
            <ListView.View>
                <GridView>
                    <GridViewColumn Header="Fruit" DisplayMemberBinding="{Binding Name}" Width="200"/>
                    <GridViewColumn Header="Color" DisplayMemberBinding="{Binding Color}" Width="200"/>
                </GridView>
            </ListView.View>
        </ListView>
    </Grid>
</Window>

MainWindow.xaml.cs:

using System.Collections.Generic;
using System.Windows;

namespace WPFApplication
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            var fruits = new List<Fruit>
            {
                new Fruit { Name = "Apple", Color = "Red" },
                new Fruit { Name = "Banana", Color = "Yellow" },
                new Fruit { Name = "Cherry", Color = "Red" }
            };
            listView.ItemsSource = fruits;
        }
    }

    public class Fruit
    {
        public string Name { get; set; }
        public string Color { get; set; }
    }
}

এখানে, ListView কন্ট্রোল ব্যবহার করে একটি GridView তৈরি করা হয়েছে, যা প্রতিটি ফ্রুটের নাম এবং রঙ প্রদর্শন করবে।

TreeView কী? (What is TreeView?)

TreeView হল একটি কন্ট্রোল যা ডেটা বা আইটেমের হায়ারার্কিকাল (পিরামিডের মতো) কাঠামো প্রদর্শন করতে ব্যবহৃত হয়। এটি ডেটার পিতামাতার (parent) এবং সন্তান (child) সম্পর্কের ভিত্তিতে ডেটা দেখায়, যেমন ফোল্ডার এবং ফাইলের গঠন। TreeView কন্ট্রোলের মাধ্যমে আপনি ডেটার কাঠামো দেখাতে পারেন যা বিভিন্ন স্তরে বিভক্ত।

TreeView ব্যবহার উদাহরণ (TreeView Example)

MainWindow.xaml:

<Window x:Class="WPFApplication.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="TreeView Example" Height="350" Width="525">
    <Grid>
        <TreeView Name="treeView" Margin="10">
            <TreeViewItem Header="Fruits">
                <TreeViewItem Header="Apple"/>
                <TreeViewItem Header="Banana"/>
                <TreeViewItem Header="Cherry"/>
            </TreeViewItem>
            <TreeViewItem Header="Vegetables">
                <TreeViewItem Header="Carrot"/>
                <TreeViewItem Header="Potato"/>
                <TreeViewItem Header="Spinach"/>
            </TreeViewItem>
        </TreeView>
    </Grid>
</Window>

MainWindow.xaml.cs:

using System.Windows;

namespace WPFApplication
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }
    }
}

এখানে, TreeView কন্ট্রোলের মধ্যে দুটি পিতামাতার আইটেম রয়েছে: Fruits এবং Vegetables, এবং প্রতিটি পিতামাতার আইটেমের নিচে সন্তান আইটেমগুলির তালিকা রয়েছে।

ItemsControl, ListView, এবং TreeView এর মধ্যে পার্থক্য (Differences Between ItemsControl, ListView, and TreeView)

সারাংশ (Summary)

• ItemsControl সাধারণ তালিকা বা আইটেমের জন্য ব্যবহৃত হয়, এবং এটি UI কাস্টমাইজ করার জন্য সবচেয়ে মৌলিক কন্ট্রোল।
• ListView একটি উন্নত কন্ট্রোল যা টেবিলের মতো সাজানো ডেটা প্রদর্শন করতে সক্ষম এবং কলাম, হেডার, এবং সোর্টিং সাপোর্ট করে।
• TreeView হায়ারার্কিকাল ডেটা প্রদর্শনের জন্য ব্যবহৃত হয়, যেমন ফোল্ডার এবং ফাইলের গঠন বা কোন ডেটা পিতামাতা-সন্তান সম্পর্কের মধ্যে রয়েছে।

এই কন্ট্রোলগুলি আপনার WPF অ্যাপ্লিকেশনে ডেটা প্রদর্শন এবং কাস্টম UI তৈরি করতে অত্যন্ত কার্যকরী।

DataTemplate এবং ItemTemplate WPF (Windows Presentation Foundation) এ ডেটা বাইন্ডিংয়ের মাধ্যমে UI উপাদান কাস্টমাইজ করার জন্য ব্যবহৃত হয়। DataTemplate ডেটা অবজেক্টের জন্য UI উপাদান কাস্টমাইজ করে, এবং ItemTemplate ব্যবহার করা হয় ListBox, ComboBox, বা অন্যান্য ICollectionView-বিন্যস্ত কন্ট্রোলগুলিতে আইটেমগুলি কাস্টমাইজ করতে। যখন ডেটা অবজেক্টের ভিত্তিতে বিভিন্ন UI উপাদান বা বিন্যাস নির্বাচন করার প্রয়োজন হয়, তখন DataTemplateSelector ব্যবহার করা হয়।

DataTemplate এবং ItemTemplate এর মধ্যে পার্থক্য

• DataTemplate:
  • এটি একটি বিশেষ UI উপাদান বা কন্ট্রোল তৈরি করার জন্য ব্যবহৃত হয় যেটি একটি ডেটা অবজেক্টের সাথে বাইন্ড হয়।
  • এটি সাধারণত একক ডেটা উপাদানের জন্য ব্যবহৃত হয় এবং UI এর লেআউট এবং ফরম্যাট কাস্টমাইজ করে।
• ItemTemplate:
  • এটি সাধারণত ListBox, ComboBox, DataGrid ইত্যাদি কন্ট্রোলের আইটেমগুলির জন্য ব্যবহৃত হয়। যখন একটি কন্ট্রোল একটি ডেটা সংগ্রহ (যেমন List, Collection) প্রদর্শন করে, তখন ItemTemplate ব্যবহার করে আইটেমের UI কাস্টমাইজ করা হয়।

DataTemplateSelector

DataTemplateSelector WPF-তে একটি কাস্টম ক্লাস যা আপনাকে ডেটার ধরনের উপর ভিত্তি করে ডেটা টেমপ্লেট নির্বাচন করতে সহায়তা করে। যখন একাধিক DataTemplate থাকে এবং আপনি ডেটার ধরণের উপর ভিত্তি করে আলাদা UI টেমপ্লেট নির্বাচন করতে চান, তখন DataTemplateSelector ব্যবহার করা হয়।

DataTemplateSelector এর ব্যবহার

1. DataTemplateSelector একটি কাস্টম ক্লাস হিসেবে তৈরি করতে হয় যা SelectTemplate মেথড Override করে।
2. SelectTemplate মেথডটি তখন ডেটার উপাদান অনুসারে সঠিক DataTemplate নির্বাচন করে।

উদাহরণ: DataTemplateSelector ব্যবহার

ধরা যাক আমাদের কাছে দুইটি ধরনের ডেটা অবজেক্ট রয়েছে, একটি Product এবং একটি Customer, এবং আমরা এই ডেটার জন্য আলাদা DataTemplate ব্যবহার করতে চাই।

Step 1: DataTemplateSelector ক্লাস তৈরি করা

public class CustomTemplateSelector : DataTemplateSelector
{
    public DataTemplate ProductTemplate { get; set; }
    public DataTemplate CustomerTemplate { get; set; }

    public override DataTemplate SelectTemplate(object item, DependencyObject container)
    {
        if (item is Product)
        {
            return ProductTemplate;
        }
        else if (item is Customer)
        {
            return CustomerTemplate;
        }
        return base.SelectTemplate(item, container);
    }
}

এখানে, CustomTemplateSelector ক্লাসটি DataTemplateSelector কে ইনহেরিট করে। SelectTemplate মেথডটি কাস্টমাইজ করা হয়েছে যাতে এটি ডেটার ধরন অনুযায়ী টেমপ্লেট সিলেক্ট করে।

Step 2: XAML এ DataTemplate এবং TemplateSelector ব্যবহার করা

<Window x:Class="WPFApplication.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:WPFApplication"
        Title="DataTemplateSelector Example" Height="350" Width="525">
    
    <Window.Resources>
        <!-- Data Templates for Product and Customer -->
        <DataTemplate x:Key="ProductTemplate">
            <StackPanel>
                <TextBlock Text="Product" FontWeight="Bold"/>
                <TextBlock Text="{Binding Name}"/>
                <TextBlock Text="{Binding Price}"/>
            </StackPanel>
        </DataTemplate>

        <DataTemplate x:Key="CustomerTemplate">
            <StackPanel>
                <TextBlock Text="Customer" FontWeight="Bold"/>
                <TextBlock Text="{Binding Name}"/>
                <TextBlock Text="{Binding Address}"/>
            </StackPanel>
        </DataTemplate>

        <!-- DataTemplateSelector -->
        <local:CustomTemplateSelector x:Key="CustomTemplateSelector"
                                      ProductTemplate="{StaticResource ProductTemplate}"
                                      CustomerTemplate="{StaticResource CustomerTemplate}" />
    </Window.Resources>

    <Grid>
        <ListBox ItemsSource="{Binding Data}"
                 ItemTemplateSelector="{StaticResource CustomTemplateSelector}">
        </ListBox>
    </Grid>
</Window>

Step 3: Data Binding and DataContext

public partial class MainWindow : Window
{
    public ObservableCollection<object> Data { get; set; }

    public MainWindow()
    {
        InitializeComponent();

        // Sample data
        Data = new ObservableCollection<object>
        {
            new Product { Name = "Laptop", Price = "$1200" },
            new Customer { Name = "John Doe", Address = "123 Main St" }
        };

        DataContext = this;
    }
}

public class Product
{
    public string Name { get; set; }
    public string Price { get; set; }
}

public class Customer
{
    public string Name { get; set; }
    public string Address { get; set; }
}

এখানে:

• Product এবং Customer ক্লাসের জন্য আলাদা DataTemplate তৈরি করা হয়েছে।
• CustomTemplateSelector কাস্টম ক্লাসে SelectTemplate মেথড ব্যবহার করে সঠিক টেমপ্লেট নির্বাচন করা হয়েছে।
• ListBox এ ItemTemplateSelector ব্যবহার করা হয়েছে, যেখানে CustomTemplateSelector এর মাধ্যমে সঠিক টেমপ্লেট নির্বাচিত হবে।

ItemTemplate Customization

ItemTemplate ListBox বা ComboBox ইত্যাদি কন্ট্রোলের আইটেম কাস্টমাইজ করার জন্য ব্যবহৃত হয়। এটি ব্যবহার করে আপনি কন্ট্রোলের আইটেমগুলোর উপস্থাপন পদ্ধতি পরিবর্তন করতে পারেন। ItemTemplate ব্যবহার করে, আপনি UI কন্ট্রোলের আউটপুটকে সম্পূর্ণভাবে কাস্টমাইজ করতে পারবেন।

উদাহরণ: ListBox এর ItemTemplate কাস্টমাইজ করা

<ListBox>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel>
                <TextBlock Text="{Binding Name}" FontWeight="Bold"/>
                <TextBlock Text="{Binding Description}"/>
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

এখানে, ItemTemplate ব্যবহার করে ListBox এর প্রতিটি আইটেমের জন্য একটি কাস্টম UI তৈরি করা হয়েছে। প্রতিটি আইটেমের মধ্যে Name এবং Description ডেটার মান প্রদর্শন করা হচ্ছে।

সারাংশ (Summary)

• DataTemplate UI কাস্টমাইজেশনের জন্য ব্যবহৃত হয়, যা ডেটার ধরন অনুযায়ী কন্ট্রোলের উপস্থাপন পরিবর্তন করে।
• ItemTemplate ব্যবহার করে, ListBox, ComboBox, বা অন্যান্য ICollectionView কন্ট্রোলের আইটেম কাস্টমাইজ করা যায়।
• DataTemplateSelector ব্যবহার করে আপনি ডেটার ধরন অনুযায়ী আলাদা টেমপ্লেট নির্বাচন করতে পারেন।
• ItemTemplate এবং DataTemplateSelector এর মাধ্যমে আপনি WPF অ্যাপ্লিকেশনে কাস্টম UI উপাদান তৈরি এবং ডেটা প্রদর্শন করতে সক্ষম।

CollectionView একটি WPF ডেটা-ভিউ সমাধান, যা আপনাকে ডেটাকে সজ্জিত (sort), ফিল্টার (filter), এবং পেজিনেট (paginate) করার সুবিধা দেয়। এটি ডেটা সোর্স (যেমন একটি ObservableCollection বা List) এবং UI এর মধ্যে একটি "ভিউ" তৈরি করে, যা ডেটাকে ভিজ্যুয়ালি উপস্থাপন করার জন্য প্রক্রিয়া করে। CollectionView সাধারণত ডেটা লিস্ট বা কোলেকশনগুলোর সাথে কাজ করতে ব্যবহৃত হয়, বিশেষ করে যখন ডেটা সজ্জিত বা ফিল্টার করতে হয়।

CollectionView এর প্রাথমিক ধারণা

CollectionView একটি কনটেইনার (container) যা একটি ডেটা কোলেকশন (যেমন ObservableCollection<T> বা List<T>) কে UI তে দেখানোর জন্য প্রক্রিয়া করে। এটি ডেটার সজ্জন, ফিল্টারিং, গ্রুপিং এবং পেজিনেশন করার ক্ষমতা প্রদান করে। CollectionView ডেটার ভিউ ম্যানেজ করার জন্য WPF এর বিভিন্ন কন্ট্রোল যেমন ListView, ComboBox, DataGrid ইত্যাদির সাথে ব্যবহৃত হয়।

CollectionView এর বৈশিষ্ট্য (Features of CollectionView)

• Sorting: ডেটাকে একটি নির্দিষ্ট অর্ডারে সাজানো (ascending বা descending)।
• Filtering: ডেটার মধ্যে কিছু নির্দিষ্ট মান বা শর্ত মেনে ফলাফল দেখানো।
• Grouping: ডেটাকে একটি নির্দিষ্ট শর্তের উপর ভিত্তি করে গ্রুপ করা (যেমন, ক্যাটেগরি বা তারিখ অনুযায়ী)।
• Current Item Management: ডেটার মধ্যে একটি "current item" বা নির্বাচিত আইটেম পরিচালনা করা।

CollectionView ব্যবহার করা (Using CollectionView)

WPF-এ CollectionView তৈরি করতে, আপনি সাধারণত CollectionViewSource ব্যবহার করবেন, যা ডেটাকে সরাসরি প্রক্রিয়া করতে সহায়তা করে। একটি CollectionView তৈরির জন্য CollectionViewSource.GetDefaultView() ব্যবহার করা যেতে পারে।

উদাহরণ:

ধরা যাক, আমাদের কাছে একটি ObservableCollection রয়েছে, এবং আমরা এটি UI তে দেখাতে চাই:

public class Person
{
    public string Name { get; set; }
    public int Age { get; set; }
}

এখন, আমাদের একটি ObservableCollection তৈরি করা যাক এবং এটি CollectionView এর মাধ্যমে ভিউতে দেখাবো।

ObservableCollection<Person> people = new ObservableCollection<Person>
{
    new Person { Name = "John", Age = 30 },
    new Person { Name = "Alice", Age = 25 },
    new Person { Name = "Bob", Age = 35 }
};

// Create CollectionView
CollectionView view = (CollectionView)CollectionViewSource.GetDefaultView(people);

// Bind to ListView in XAML
myListView.ItemsSource = view;

এখানে, CollectionViewSource.GetDefaultView(people) এর মাধ্যমে people কোলেকশনের জন্য একটি CollectionView তৈরি করা হয়েছে, এবং এটি ListView এর ItemsSource এ ব্যাইন্ড করা হয়েছে।

Data Sorting (ডেটা সজ্জন)

Sorting ব্যবহার করে আপনি ডেটাকে নির্দিষ্ট একটি অর্ডারে সাজাতে পারেন। CollectionView এ ডেটা সাজানোর জন্য SortDescriptions প্রপার্টি ব্যবহার করা হয়।

Sorting উদাহরণ:

// Sorting by Age
view.SortDescriptions.Clear();  // Clear existing sort criteria
view.SortDescriptions.Add(new SortDescription("Age", ListSortDirection.Ascending));

এখানে, SortDescriptions.Add() দিয়ে আমরা Age প্রপার্টির উপর সজ্জন (ascending) যুক্ত করেছি। এখন, view তে থাকা আইটেমগুলি Age অনুযায়ী সাজানো হবে।

Data Filtering (ডেটা ফিল্টারিং)

Filtering ব্যবহার করে আপনি ডেটার মধ্যে শর্ত অনুসারে নির্দিষ্ট আইটেমগুলো প্রদর্শন করতে পারেন। CollectionView এ ফিল্টারিংয়ের জন্য Filter প্রপার্টি ব্যবহার করা হয়।

Filtering উদাহরণ:

// Filtering by Age > 30
view.Filter = (item) =>
{
    Person person = item as Person;
    return person != null && person.Age > 30;
};

এখানে, Filter প্রপার্টিতে একটি ফাংশন সেট করা হয়েছে যা Age ৩০ এর বেশি এমন Person আইটেমগুলোকে ফিল্টার করবে এবং UI তে শুধুমাত্র সেগুলো দেখাবে।

Sorting এবং Filtering একসাথে ব্যবহার করা

আপনি একসাথে Sorting এবং Filtering ব্যবহার করতে পারেন, যা ডেটাকে প্রথমে ফিল্টার করবে এবং পরে সাজাবে।

উদাহরণ:

// Filter by Age > 30
view.Filter = (item) =>
{
    Person person = item as Person;
    return person != null && person.Age > 30;
};

// Sort by Name
view.SortDescriptions.Clear();
view.SortDescriptions.Add(new SortDescription("Name", ListSortDirection.Ascending));

এখানে, প্রথমে Age এর ওপর ফিল্টার করা হচ্ছে এবং তারপর Name অনুযায়ী সজ্জন করা হচ্ছে। এর ফলে শুধুমাত্র Age > 30 আইটেমগুলি Name অনুযায়ী সাজানো হবে।

CollectionView এর সাথে গ্রুপিং (Grouping with CollectionView)

Grouping ব্যবহার করে আপনি ডেটাকে বিভিন্ন গ্রুপে ভাগ করতে পারেন, যেমন একটি ক্যাটেগরি বা তারিখ অনুযায়ী। গ্রুপিংয়ের জন্য GroupDescriptions প্রপার্টি ব্যবহার করা হয়।

গ্রুপিং উদাহরণ:

// Grouping by Age
view.GroupDescriptions.Clear();
view.GroupDescriptions.Add(new PropertyGroupDescription("Age"));

এখানে, PropertyGroupDescription("Age") এর মাধ্যমে আমরা ডেটাকে Age এর ওপর ভিত্তি করে গ্রুপ করেছি। এর ফলে একই Age মানের আইটেমগুলি একসাথে গ্রুপ হয়ে থাকবে।

সারাংশ (Summary)

• CollectionView: ডেটা ভিউ এবং UI এর মধ্যে একটি মধ্যবর্তী স্তর, যা ডেটাকে সজ্জিত (sort), ফিল্টার (filter), এবং গ্রুপ (group) করার জন্য ব্যবহৃত হয়।
• Sorting: ডেটাকে একটি নির্দিষ্ট অর্ডারে সাজানো (ascending বা descending)।
• Filtering: ডেটার মধ্যে কিছু নির্দিষ্ট শর্ত মেনে ফলাফল দেখানো।
• Grouping: ডেটাকে একটি নির্দিষ্ট শর্তের উপর ভিত্তি করে গ্রুপ করা (যেমন, ক্যাটেগরি বা তারিখ অনুযায়ী)।

CollectionView এর মাধ্যমে WPF অ্যাপ্লিকেশনে ডেটা পরিচালনা সহজ হয় এবং এটি UI তে ডেটার ডাইনামিক পরিবর্তনগুলোকে স্বয়ংক্রিয়ভাবে প্রতিফলিত করে।